<template>
  <div class="box" style="padding-top: 30px; padding-bottom: 10px">
    <!-- <div class="title yellow_title">
      <div class="blue"></div>
      联系人信息
    </div>
    <div class="bott">
      <div class="left">联系人</div>
      <input
        type="text"
        v-model="formName"
        class="bottom right_input"
        placeholder="请输入内容"
        @input="changeName"
      />
    </div>
    <div class="bott">
      <div class="left">电话号码</div>
      <input
        v-model="formPhone"
        type="number"
        class="bottom right_input"
        placeholder="请输入内容"
        @input="changePhone"
      />
    </div> -->
  </div>
</template>
<script setup>
import { ref, onMounted } from 'vue';
const props = defineProps({
  contactName: String,
  phone: Number,
});

const formName = ref('');
const formPhone = ref('');

onMounted(() => {
  formName.value = props.contactName;
  formPhone.value = props.phone;
});

const emit = defineEmits(['update:contactName', 'update:phone']);

const changeName = (e) => {
  emit('update:contactName', e.target.value);
};
const changePhone = (e) => {
  emit('update:phone', e.target.value);
};
</script>
